import { compileToFunction } from "./compile/index"
import { initState } from "./initState"

export function initMixin(Vue) {
    Vue.prototype._init = function (options) {
        // console.log(options);
        // 这个options是用户传递过来的值
        let vm = this  //vue实例,this指向的是vue的原型链
        // 将用户的配置项存放在vue实例上
        vm.$options = options
        // console.log(vm);
        // 初始化状态
        initState(vm)
        // 渲染模板
        if (vm.$options.el) {
            vm.$mount(vm.$options.el)
        }
    }
    // 创建 $mount 
    Vue.prototype.$mount = function (el) {
        console.log(el);

        let vm = this
        el = document.querySelector(el)
        let options = vm.$options
        // 判断参数中有没有render这个函数
        if(!options.render){  // 先走render 再走template 最后走el 但是必须要有el
            let template = options.template
            if(!template && el){  // 没有template 但是有el 
                // 获取HTML,通过他的方法outerHTML 可以获取整个标签
                el = el.outerHTML
                // console.log(el); // 获取的是一个dom元素，将其变成一个ast树
                // 变成ast语法树
                let ast =  compileToFunction(el) // 将dom变成语法树
                // render() 函数

                // 虚拟dom

                // 真实的结点
            }
        }
    }
}



